<template>
	<view class="login flex-center">
		<view class="content">
			<view class="logo">
				<image src="/static/logo.png" mode="widthFix"></image>
			</view>
			
			<form @submit="register">
				<view class="title">推荐人ID</view>
				<input type="text" placeholder="请输入推荐人ID(如无推荐人可填XXX)" name="id">
				<button form-type="submit" class="btn flex-center">注册</button>
			</form>
			<form @submit="login">
				<view class="title">用户ID</view>
				<input type="text" placeholder="请输入您的账号" name="username">
				<button form-type="submit" class="btn flex-center">登录</button>
			</form>
		</view>		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			};
		},
		methods:{
			// 注册
			register(e){
				console.log(e.detail.value)
			},
			// 登录
			login(e){
				console.log(e.detail.value)
			}
			
		}
	}
</script>

<style lang="less" scoped>
	.login{
		padding:100rpx 66rpx ;
		box-sizing: border-box;
		min-height: 100vh;
		.content{
			width: 100%;
		}
		.logo{
			text-align: center;
			image{
				width: 270rpx;
				height:auto;
			}
		}
		form{
			display: block;
			width: 100%;
			margin-top: 100rpx;
			.title{
				font-size: 30rpx;
				color: #898ea3;
			}
			input{
				font-size: 30rpx;
				color: #898ea3;
				border-bottom: 2rpx solid #898ea3;
				height: 60rpx;
			}
			.input-placeholder{
				color: #898ea3;
			}
			.btn{
				height: 94rpx;
				background: url('/static/login-btn.png') no-repeat 0 0;
				background-size: 100% 100%;
				margin-top: 70rpx;
				font-size: 34rpx;
				color: #ffffff;
			}
		}
		
	}
</style>
